import 'package:flutter/material.dart';
import 'package:getx_scaffold/common/index.dart';
import 'package:oramemo/common/styles/colors.dart';
import 'package:oramemo/generated/assets.dart';
import 'package:oramemo/pages/circle/members/device_circle_members_page.dart';
import 'package:oramemo/pages/home/home_logic.dart';
import 'package:oramemo/pages/transcription/ai_transcription/ai_transcription_logic.dart';
import 'package:oramemo/pages/transcription/transcription_router.dart';

import 'call/call_view.dart';
import 'event/event_view.dart';
import 'first_logic.dart';
import 'msg/msg_view.dart';
import 'device_view.dart';

class FirstPage extends StatelessWidget {
  const FirstPage({super.key});

  @override
  Widget build(BuildContext context) {
    return Container(
      height: Get.height,
      color: Colors.white,
      child: SafeArea(
        child: Column(
          mainAxisSize: MainAxisSize.max,
          children: [
            SizedBox(height: 36.h),
            Row(
              children: [
                SizedBox(width: 16.w),
                Expanded(
                  child: Text('欢迎使用OraMemo',
                      style: TextStyle(
                          fontSize: 24.sp, fontWeight: FontWeight.w600)),
                ),
                // InkWell(
                //     onTap: () {
                //       Get.toNamed(TranscriptionRouter.transcriptionRecoder);
                //     },
                //     child: const IconX.image(
                //       Assets.transcriptionRecord,
                //       size: 28,
                //     )),
                const SizedBox(width: 25),
              ],
            ),
            SizedBox(height: 30.h),
            GetBuilder<FirstLogic>(
                init: FirstLogic(),
                builder: (logic) {
                  final data = HomeLogic.to.deviceController.devices;
                  return DeviceView(devices: data);
                }),
            const Expanded(
              child: CustomTabBar(),
            ),
          ],
        ),
      ),
    );
  }
}

class CustomTabBar extends StatefulWidget {
  const CustomTabBar({super.key});

  @override
  _CustomTabBarState createState() => _CustomTabBarState();
}

class _CustomTabBarState extends State<CustomTabBar>
    with SingleTickerProviderStateMixin {
  final tabs = ['消息', '圈子', '呼叫'];
  late TabController _tabController;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: tabs.length);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        SizedBox(height: 20.h),
        _tabBar(),
        Expanded(
          child: Container(
            margin: EdgeInsets.only(left: 16.w, right: 16.w),
            decoration: ShapeDecoration(
              color: const Color(0xFFF3F5F9),
              shape: RoundedRectangleBorder(
                side: const BorderSide(width: 1, color: Color(0x1992B9FF)),
                borderRadius: BorderRadius.only(
                    topLeft: Radius.circular(36.r),
                    topRight: Radius.circular(36.r)),
              ),
            ),
            child: GetBuilder<FirstLogic>(builder: (logic) {
              if (HomeLogic.to.state.currentDevice == null) {
                return Column(
                  children: [
                    SizedBox(
                      width: double.infinity,
                      height: 68.h,
                    ),
                    IconX.image(
                      Assets.imagesMsgNull,
                      width: 201.83.w,
                      height: 118.24.h,
                    ),
                    const Text(
                      '绑定或加入时光机，即可收取信息',
                      textAlign: TextAlign.center,
                      style: TextStyle(
                        color: Color(0xFF787979),
                        fontSize: 12,
                        fontFamily: 'Inter',
                        fontWeight: FontWeight.w400,
                      ),
                    ),
                  ],
                );
              } else {
                return TabBarView(
                  controller: _tabController,
                  children: const [
                    MsgPage(),
                    DeviceCircleMembersPage(),
                    // EventPage(),
                    CallPage(),
                  ],
                );
              }
            }),
          ),
        ),
      ],
    );
  }

  TabBar _tabBar() {
    return TabBar(
      onTap: (tab) {
        print(tab);
      },
      padding: EdgeInsets.symmetric(horizontal: 50.w),
      dividerHeight: 0,
      labelStyle: TextStyle(fontSize: 20.sp, fontWeight: FontWeight.bold),
      unselectedLabelStyle:
          TextStyle(fontSize: 20.sp, fontWeight: FontWeight.bold),
      labelPadding: EdgeInsets.zero,
      indicator: const BoxDecoration(),
      indicatorPadding: EdgeInsets.zero,
      isScrollable: false,
      controller: _tabController,
      unselectedLabelColor: Colours.text_gray,
      labelColor: Colours.app_main,
      tabs: tabs
          .map((e) => Tab(
                text: e,
                height: 40.h,
              ))
          .toList(),
    );
  }
}
